<template>
  <div class="back-wrapper"
       @click="handleClick">
    <svg-icon icon-class="back"
              class-name="custom-class"
              class="login-icon" :class="show ? 'white' : 'black'" />
  </div>
</template>

<script>
export default {
  name: 'back',
  data () {
    return {
    }
  },
  computed: {
    show () {
      const white = ['/balance']
      const route = this.$route.path
      return white.includes(route)
    }
  },
  created () {
  },
  methods: {
    handleClick () {
      if (window.history.length) {
        this.$router.back()
      }
    }
  }
}
</script>

<style lang="stylus" scoped>
@import '~stylus/mixins.styl'
@import '~stylus/variable.styl'
.back-wrapper
  width 60px
  display flex
  height 100%
  justify-content center
  align-items center

  .login-icon
    width 26px
    height 26px

  .login-icon.white
    color $common_bgc

  .login-icon.black
    color $login_font_color
</style>
